<template>
	<view>
		<!-- <u-steps current="-1" direction="column" :dot="true">
      <u-steps-item title="2022-12-12 13:10" desc="退出了群聊【12月邸安团】">
      </u-steps-item>
      <u-steps-item
        title="2022-12-12 12:10"
        desc="加入了群聊【研集明选100群】"
      ></u-steps-item>
      <u-steps-item title="运输中" desc="11:40"></u-steps-item>
    </u-steps> -->

		<view class="list" v-if="dynamicList && dynamicList.length">
			<view class="item" v-for="(item, index) in dynamicList" :key="index">
				<view class="time">{{ item.createtime }}</view>
				<view class="content">{{ item.content }}</view>
			</view>
			<!-- <view class="item">
				<view>2022-12-12 12:10</view>
				<view>加入了群聊【研集明选100群】</view>
			</view> -->
		</view>
	</view>
</template>
<script>
export default {
	props: {
		dynamicList: {
			type: Array,
			defaule: [],
		},
	},
	data() {
		return {};
	},
	methods: {},
};
</script>
<style lang="scss" scoped>
.time {
	color: #9999a5;
	height: 40rpx;
	margin-bottom: 8rpx;
}
.content {
	height: 40rpx;
	margin-bottom: 30rpx;
	color: #333;
}
.list {
	.item::before {
		content: "";
		display: inline-block;
		width: 12rpx;
		height: 12rpx;
		border-radius: 50%;
		background: #9999a5;
		position: absolute;
		left: -40rpx;
		top: 15rpx;
	}
	.item::after {
		content: "";
		display: inline-block;
		width: 2rpx;
		height: 100%;
		background: #9999a5;
		position: absolute;
		left: -37rpx;
		top: 15rpx;
	}
	.item {
		position: relative;
		width: calc(100% - 40rpx);
		margin-left: 40rpx;
		padding-bottom: 40rpx;
	}
}
</style>
